import { reactive, ref } from 'vue';

export const table = {
  loading: false,
  checkedRowKeys: [],
  columnChecks: [],
  list: [
    {
      title: '1234567890123456789012345'
    }
  ],
  total: 0,
  pageSize: 0,
  pageSizes: [10, 20, 30, 40, 50],
  page: 10,
  pageCount: 0
};

export const addVisible = ref(false);
// 表单数据
const initializeForm = () => ({ title: '', parentId: 0, url: '', icon: '', sort: 0 });

export const ruleForm = ref(initializeForm());
// 表单配置
export const list = () => [
  {
    label: '菜单名称：',
    key: 'title',
    type: 'text',
    classify: 'input',
    placeholder: '请输入菜单名称',
    rules: [{ required: true, message: '请输入菜单名称', trigger: 'change' }]
  },
  {
    label: '路径：',
    key: 'url',
    type: 'text',
    classify: 'input',
    placeholder: '请输入路径',
    rules: [{ required: true, message: '请输入路径', trigger: 'change' }]
  },
  {
    label: '图标：',
    key: 'icon',
    type: 'text',
    classify: 'input',
    rules: [{ pattern: /^[a-zA-Z-]+$/, message: '图标只能包含英文字符和-', trigger: 'change' }]
  },
  {
    label: '排序：',
    key: 'sort',
    type: 'number',
    classify: 'input',
    placeholder: '请输入排序',
    rules: [{ required: true, message: '请输入排序', trigger: 'change' }]
  }
];

export const formConfig = reactive({
  config: list(),
  span: 24,
  labelFormConfig: {
    labelWidth: 'auto'
  }
});

// 重置表单
const restRuleForm = () => {
  Object.assign(ruleForm.value, initializeForm());
  // if (formRef.value) formRef.value.resetFields();
};

// 关闭弹窗
const closeVisible = () => {
  if (addVisible.value) addVisible.value = false;
};
export const onConfirm = () => {
  console.log(ruleForm.value);
  closeVisible();
};
export const onCancel = () => {
  restRuleForm();
  closeVisible();
};

// 新增行数据
export const handleAdd = () => {};

// 删除行数据
export const handleBatchDelete = () => {};

// 刷新数据
export const refresh = () => {};

// 筛选数据
export const handleFilter = () => {};
